<!DOCTYPE html>
<html>

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=Edge">
	<title>必要商城_大牌品质 工厂价格</title>
	<link href="http://static.biyao.com/pc/favicon.ico" rel="shortcut icon" type="image/x-icon">
	<link href="./lib/common.css" rel="stylesheet" type="text/css">
	<link href="./lib/new.main.css" rel="stylesheet" type="text/css">
	<link href="./lib/elementUI.css" rel="stylesheet" type="text/css">
	<link href="./lib/global.css" rel="stylesheet" type="text/css">
	<link href="./lib/iprHeader.css" rel="stylesheet" type="text/css">
	<link rel="stylesheet" type="text/css" href="./lib/new.category.css">
</head>

<body id="pagebody">
	<div class="header header-index"></div>
	<!-- 导航栏 -->
	<div class="nav nav-index">
		<div class="clearfix">
			<a href="http://www.biyao.com/home/index.html" class="nav-logo"><img src="./lib/logo.png" height="51"></a>
			<div class="nav-category">
				<p><span>全部分类</span><i></i></p>
				<div>
					<ul class="nav-list">
						<li class="nav-main">
							<p>
								<a href="http://www.biyao.com/classify/category.html?categoryId=621">
									咖啡
								</a>
								<span>/</span>
								<a href="http://www.biyao.com/classify/category.html?categoryId=627">
									饮食
								</a>
								<span>/</span>
								<a href="http://www.biyao.com/classify/category.html?categoryId=691">
									正餐
								</a>
							</p>
						</li>
						<li class="nav-main">
							<p>
								<a href="http://www.biyao.com/classify/category.html?categoryId=279">
									男装
								</a>
								<span>/</span>

								<a href="http://www.biyao.com/classify/category.html?categoryId=294">
									女装
								</a>
								<span>/</span>

								<a href="http://www.biyao.com/classify/category.html?categoryId=35">
									鞋靴
								</a>
							</p>
						</li>
						<li class="nav-main">
							<p>
								<a href="http://www.biyao.com/classify/category.html?categoryId=122">
									眼镜
								</a>
								<span>/</span>
								<a href="http://www.biyao.com/classify/category.html?categoryId=339">
									内衣配饰
								</a>
								<span>/</span>
								<a href="http://www.biyao.com/classify/category.html?categoryId=39">
									运动
								</a>
							</p>
						</li>
						<li class="nav-main">
							<p>
								<a href="http://www.biyao.com/classify/category.html?categoryId=119">
									美妆
								</a>
								<span>/</span>
								<a href="http://www.biyao.com/classify/category.html?categoryId=724">
									个护
								</a>
								<span>/</span>
								<a href="http://www.biyao.com/classify/category.html?categoryId=391">
									母婴
								</a>
							</p>
						</li>

						<li class="nav-main">
							<p>


								<a href="http://www.biyao.com/classify/category.html?categoryId=652">
									生鲜直供
								</a>

								<span>/</span>

								<a href="http://www.biyao.com/classify/category.html?categoryId=51">
									餐厨
								</a>

								<span>/</span>

								<a href="http://www.biyao.com/classify/category.html?categoryId=334">
									电器
								</a>

							</p>
						</li>

						<li class="nav-main">
							<p>


								<a href="http://www.biyao.com/classify/category.html?categoryId=153">
									箱包
								</a>

								<span>/</span>

								<a href="http://www.biyao.com/classify/category.html?categoryId=223">
									数码办公
								</a>

								<span>/</span>

								<a href="http://www.biyao.com/classify/category.html?categoryId=429">
									汽配
								</a>

							</p>
						</li>

						<li class="nav-main">
							<p>


								<a href="http://www.biyao.com/classify/category.html?categoryId=355">
									家纺
								</a>

								<span>/</span>

								<a href="http://www.biyao.com/classify/category.html?categoryId=10">
									家具
								</a>

								<span>/</span>

								<a href="http://www.biyao.com/classify/category.html?categoryId=369">
									家装
								</a>

							</p>
						</li>

						<li class="nav-main">
							<p>


								<a href="http://www.biyao.com/classify/category.html?categoryId=546">
									健康保健
								</a>

								<span>/</span>

								<a href="http://www.biyao.com/classify/category.html?categoryId=685">
									宠物
								</a>

								<span>/</span>

								<a href="http://www.biyao.com/classify/category.html?categoryId=816">
									礼品
								</a>

							</p>
						</li>

					</ul>
				</div>
			</div>
			<div class="nav-search">
				<p><input type="text" id="searchInp" placeholder="请输入要搜索的商品"><span id="searchButton"></span></p>
				<ul style="">
					<li>行李箱</li>
					<li>洗面奶</li>
					<li>枕头</li>
					<li>袜子男夏季</li>
					<li>防晒霜</li>
					<li>洗发水</li>
					<li>伞</li>
					<li>香水</li>
					<li>眼霜</li>
					<li>精华</li>
				</ul>
			</div>
			<div class="nav-tab">
				<ul>
					<li><a href="http://www.biyao.com/home/index.html">首页</a></li>
					<li><a href="http://www.biyao.com/classify/newProduct.html">每日上新</a></li>
					<li class="border-l"></li>
					<li class="nav-tab-last">
						<div class="hover_text">
							了解必要
							<div class="hover_code gzh">
								<span>关注必要微信公众号<br>了解你想了解的一切<br>小必姐在此发福利哦</span>
							</div>
						</div>
					</li>
					<li class="nav-tab-last" id="appDownload">下载必要APP</li>
					<li class="border-l"></li>
					<li class="nav-tab-last">
						<div class="hover_text">
							我的必要
							<div class="hover_code app">
								<span>
									扫码下载必要app
									<br>
									手机用户独享海量权益
								</span>
							</div>
						</div>
					</li>
				</ul>
			</div>
		</div>
	</div>

	<!-- 右边栏 -->
	<ul class="rightBar" style="display: block;">


		<li class="toggle"></li>
		<li class="rightBar-xcx-code toggle novice">
			<div class="coupon_red">
				<div class="tis">
					迎新福利<br>
					微信扫码即得
				</div>
				<div class="rightBar-title">
					15元
				</div>
				<div class="count-down" data-time="7200000" id="count-down"></div>
			</div>
			<div class="rightBar-ercode"></div>
		</li>

		<li class="rightBar-top" style="display: none;"></li>
	</ul>
	<!-- 分享弹框 -->
	<div class="shareCon">
		<div>
			<p>分享<b></b></p>
			<div class="share-main">
				<dl>
					<dt><img class="share-code" src="./lib/ewm.jpg"></dt>
					<dd>扫一扫，分享给好友！</dd>
				</dl>
			</div>
		</div>
	</div>

	<!-- 搜索商品列表 -->
	<ul class="category-container">
		<li>
			<ul class="supplier-recommen category-list clearfix">
				<!-- 每件搜索商品 -->
				<!-- <li>
					<a><i><img
								src="./lib/CghkFmIuDbOAUFjRAADsxoYlvAQ019_360x360.jpg"></i>
						<div class="supplier">祖玛珑同原料制造商</div>
						<div class="title">【会呼吸的洗发水】风铃草</div>
						<div class="priceBox">
							<div class="price" price="88"><span
									style="color: #F7A701; font-size: 12px; padding-left: 2px;">￥<span
										style="font-size:18px;">88</span></span></div>
							<div class="mack"><span
									style="color:#FB4C81;background:#FFFFFF; border-color:#FB4C81">一起拼</span><span
									style="color:#FFFFFF;background:#AB7FD1; border-color:#AB7FD1">精选</span></div>
						</div>
						<div class="evaluate">653条好评</div>
					</a>
				</li> -->
			</ul>
		</li>
	</ul>
	<script type="text/javascript" src="./lib/jquery-1.8.3.js.下载"></script>
	<script type="text/javascript" src="./lib/jquery.cookie.js.下载"></script>
	<script type="text/javascript" src="./lib/md5.js.下载"></script>
	<script type="text/javascript" src="./lib/masterCommon.js.下载"></script>
	<script type="text/javascript" src="./lib/jquery.extention.js.下载"></script>
	<script type="text/javascript" src="./lib/common.js.下载"></script>
	<script type="text/javascript" src="./lib/qs.min.js.下载"></script>
	<script type="text/javascript" src="./lib/vue.min.js.下载"></script>
	<script type="text/javascript" src="./lib/elementUI.min.js.下载"></script>
	<script type="text/javascript" src="./lib/utils.js.下载"></script>
	<script src="./lib/smcp.min.js.下载"></script>
	<script src="./lib/dialog.js.下载"></script>
	<script src="./lib/md5.js(1).下载"></script>
	<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
	<script>
		const btn = document.querySelector('#searchButton')
		const ipt = document.querySelector('#searchInp')
		const list = document.querySelector('.category-list')
		const api = 'http://123.57.109.30:3999/api/searchGoodsList'
		btn.addEventListener('click', function () {
			cat()
		})
		ipt.addEventListener('keyup', function (e) {
			if (e.key === 'Enter') {
				cat()
			}
		})
		const cat = function () {
			const value = ipt.value.trim()
			axios.get(`${api}?searchText=${value}&page=${1}&everyNum=${16}`)
				.then(res => {
					console.log(res);
					list.innerHTML = res.data.list.data.map(el => {
                    return  `
				 <li>
					<a><i><img
								src="${el.imageUrl}"></i>
						<div class="supplier">祖玛珑同原料制造商</div>
						<div class="title">${el.goodsName}</div>
						<div class="priceBox">
							<div class="price" price="${el.goodsPrice}"><span
									style="color: #F7A701; font-size: 12px; padding-left: 2px;">￥<span
										style="font-size:18px;">${el.goodsPrice}</span></span></div>
							<div class="mack"><span
									style="color:#FB4C81;background:#FFFFFF; border-color:#FB4C81">一起拼</span><span
									style="color:#FFFFFF;background:#AB7FD1; border-color:#AB7FD1">精选</span></div>
						</div>
						<div class="evaluate">${el.evalNum}条好评</div>
					</a>
				</li>
					  `
			}).join('')
					
				})

		}
	</script>
</body>

</html>